﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="ReportAnalysis.aspx.cs" Inherits="IHISCETeim.Web.MachineSys.FXModel.ReportAnalysis" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>风险部汇总报表分析</title>
    <style type="text/css">
        html, body, div, span, applet, object, iframe,
        h1, h2, h3, h4, h5, h6, p, blockquote, pre,
        a, abbr, acronym, address, big, cite, code,
        del, dfn, em, font, img, ins, kbd, q, s, samp,
        small, strike, strong, sub, sup, tt, var,
        dl, dt, dd, ol, ul, li,
        fieldset, form, label, legend,
        table, caption, tbody, tfoot, thead, tr, th, td { padding:0; margin:0; font-size:12px; line-height:100%; font-family:Arial, sans-serif;}
        table{}
        .table{ border:1px solid #000; border-collapse:collapse;cursor:pointer;}
        .table th{ text-align:center; line-height:25px;border:1px solid #000; background-color:#F7F3F7;}
        .table td{ text-align:left; line-height:16px;border:1px solid #000; padding:2px;}
        .table tr.AlItemTr td{ background: none repeat scroll 0 0 #EFEFEF;}
        .table tr.SiItemTr{}
        .table tr.selectTr{background: none repeat scroll 0 0 #F78618;}
        .table tr.mouseoverTr{background: none repeat scroll 0 0 #FFCF6B;}
        div.reportList{ line-height:21px;}
        div.reportList ul{ list-style-type:none; padding-left:12px;}
        div.reportList ul li{ list-style-type:none;  float:left; display:block; width:150px;display:block; margin:2px 10px 2px 2px; border:1px solid #ccc; padding:2px;} 
        div.reportList ul li.selected{ border:1px solid red!important; background-color:#ccc; }         
        div.reportList ul li a{ text-decoration: none;color: #000000; line-height:21px; height:21px;}
        div.reportList ul li a.selected{ color:Green;}
    </style>
    <script src="../js/jquery-1.7.2.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="../Highcharts/js/highcharts.js"></script>
    <script type="text/javascript" src="../Highcharts/js/modules/exporting.js"></script>
    <script>
        $(document).ready(function () {
            $("table.table").find("tbody tr").click(function () {
                var $tody = $(this).closest("tbody").find("tr").removeClass("selectTr");
                $(this).addClass("selectTr");
            }).mouseover(function () {
                var $tody = $(this).closest("tbody").find("tr").removeClass("mouseoverTr");
                $(this).addClass("mouseoverTr");
            }).mouseout(function () {
                var $tody = $(this).closest("tbody").find("tr").removeClass("mouseoverTr");

            })
        })
    </script>
</head>
<body style="">   
 <form id="form1" runat="server">
    <div style="padding:5px;margin:5px; border:1px solid #ccc;">
       <h2 style=" text-align:left; padding-left:12px; margin-bottom:5px;">分析报表</h2>
        <div class="reportList">
            <ul>
                <li class="<%=ReportType==1?"selected":"" %>"><a href="ReportAnalysis.aspx?rt=1" class="<%=ReportType==1?"selected":"" %>">1.经销商放款台数占比分析</a></li>
                <li class="<%=ReportType==2?"selected":"" %>"><a href="ReportAnalysis.aspx?rt=2" class="<%=ReportType==2?"selected":"" %>">2.融资租赁机型占比分析</a></li>
                <li class="<%=ReportType==3?"selected":"" %>"><a href="ReportAnalysis.aspx?rt=3" class="<%=ReportType==3?"selected":"" %>">3.融资租赁期限占比分析</a></li>
                <li class="<%=ReportType==4?"selected":"" %>"><a href="ReportAnalysis.aspx?rt=4" class="<%=ReportType==4?"selected":"" %>">4.同期放款台数对比分析</a></li>
                <li class="<%=ReportType==5?"selected":"" %>"><a href="ReportAnalysis.aspx?rt=5" class="<%=ReportType==5?"selected":"" %>">5.同期放款融资额对比分析</a></li>
                <li class="<%=ReportType==6?"selected":"" %>"><a href="ReportAnalysis.aspx?rt=6" class="<%=ReportType==6?"selected":"" %>">6.同期报单台数对比分析</a></li>
            </ul>
        </div>
        <div style=" clear:both;"></div>
    </div>
    <div style="border:1px solid #ccc;padding:5px; margin:5px; height:1000px;  ">               
        <%if (ReportType == 1){ %>
            <table width="100%" height="1000px">
                <tr>
                    <td valign="top" width="60%" >
                        <asp:GridView ID="gv1" runat="server" CssClass="table" AutoGenerateColumns="true" Width="100%">
                        </asp:GridView>
                    </td>
                    <td valign="top" width="40%" >
                        <div id="ReportType1container" style="height:1000px;width:100%;" >
                        图
                        </div>
                    </td>
                </tr>
            </table>
            <script type="text/javascript">
                var chart;
                $(document).ready(function () {
                    chart = new Highcharts.Chart({
                        chart: {
                            renderTo: 'ReportType1container',
                            defaultSeriesType: 'bar'
                        },
                        title: {
                            text: '经销商放款台数占比分析'
                        },
                        subtitle: {
                            text: ''
                        },
                        xAxis: {
                            categories: <%=GetReport1JSCategories() %>
                           
                        },
                        yAxis: {
                            min: 0,
                            title: {
                                text: ''
                            }
                        },
                        tooltip: {
                            formatter: function () {
                                return '' +
					        this.x + ': ' + this.y + ' 台';
                            }
                        },
                        plotOptions: {
                            bar: {
                                dataLabels: {
                                    enabled: true
                                }
                            }
                        },
                        legend: {
                            enabled: false
                        },
                        credits: {
                            enabled: false
                        },
                        exporting: {
                            enabled: true
                        },
                        series: <%=GetReport1JSSeries() %>
                    });
                });

	        </script>
        <%} %>
        <%if (ReportType == 2)
          { %>
           <table width="100%" height="450px">
                <tr>
                    <td valign="top" width="40%" >
                      

                        <asp:repeater id="gv2" runat="server">
                        <HeaderTemplate>
                            <table class="table" width="100%" >
                            <thead>
                                <tr  >  
                                    <th align="center">
                                        机型
                                    </th>
                                    <th >
                                        台数
                                    </th>                                    
                                    <th >
                                        占比
                                    </th>               
                                </tr>
                            </thead>
                            <tbody>
                         </HeaderTemplate>
                         <ItemTemplate>
                                <tr target="sid_user" >			
				                    <td><%# Eval("机型")%></td>
				                    <td><%# Eval("台数")%></td>
                                    <td><%# FormatDecimalToStrings(Eval("占比"),"G")%>%</td>                                    
			                    </tr>
                         </ItemTemplate>
                         <FooterTemplate>
                                </tbody>
                             </table>
                         </FooterTemplate>
                        </asp:repeater>

                    </td>
                    <td valign="top" width="60%" >
                        <div id="ReportType2container" style="width:100%;" >
                        图
                        </div>
                    </td>
                </tr>
            </table>
            <script  type="text/javascript">
                var chart;
                $(document).ready(function () {
                    chart = new Highcharts.Chart({
                        chart: {
                            renderTo: 'ReportType2container',
                            plotBackgroundColor: null,
                            plotBorderWidth: null,
                            plotShadow: false
                        },
                        title: {
                            text: '融资租赁机型占比分析'
                        },
                        tooltip: {
                            formatter: function () {
                                return '<b>' + this.point.name + '</b>: ' + this.percentage + ' %';
                            }
                        },
                        plotOptions: {
                            pie: {
                                allowPointSelect: true,
                                cursor: 'pointer',
                                dataLabels: {
                                    enabled: true,
                                    color: '#000000',
                                    connectorColor: '#000000',
                                    formatter: function () {
                                        return '<b>' + this.point.name + '</b>: ' + this.y + ' %';
                                    }
                                }
                            }
                        },
                        series: [{
                            type: 'pie',
                            name: '机型占比',
                            data: [
				               <%=GetReport2JSSeries() %>
			                ]
                        }]
                    });
                });

            </script>
        <%} %>
        <%if (ReportType == 3)
          { %>
           <table width="100%" height="450px">
                <tr>
                    <td valign="top" width="40%" >
                        <asp:repeater id="gv3" runat="server">
                        <HeaderTemplate>
                            <table class="table" width="100%" >
                            <thead>
                                <tr  >  
                                    <th align="center">
                                        融资期限(年)
                                    </th>
                                    <th >
                                        台数
                                    </th>                                    
                                    <th >
                                        占比
                                    </th>               
                                </tr>
                            </thead>
                            <tbody>
                         </HeaderTemplate>
                         <ItemTemplate>
                                <tr target="sid_user" >			
				                    <td><%# FormatDecimalToStrings(Eval("融资期限"),"g")%></td>
				                    <td><%# Eval("台数")%></td>
                                    <td><%# FormatDecimalToStrings(Eval("占比"), "G")%>%</td>                                    
			                    </tr>
                         </ItemTemplate>
                         <FooterTemplate>
                                </tbody>
                             </table>
                         </FooterTemplate>
                        </asp:repeater>
                    </td>
                    <td valign="top" width="60%" >
                        <div id="ReportType3container" style="width:100%;" >
                        图
                        </div>
                    </td>
                </tr>
            </table>
            <script  type="text/javascript">
                var chart;
                $(document).ready(function () {
                    chart = new Highcharts.Chart({
                        chart: {
                            renderTo: 'ReportType3container',
                            plotBackgroundColor: null,
                            plotBorderWidth: null,
                            plotShadow: false
                        },
                        title: {
                            text: '融资租赁期限占比分析'
                        },
                        tooltip: {
                            formatter: function () {
                                return '<b>' + this.point.name + '年</b>: ' + this.y + ' %';
                            }
                        },
                        plotOptions: {
                            pie: {
                                allowPointSelect: true,
                                cursor: 'pointer',
                                dataLabels: {
                                    enabled: true,
                                    color: '#000000',
                                    connectorColor: '#000000',
                                    formatter: function () {
                                        return '<b>' + this.point.name + '年</b>: ' + this.y + ' %';
                                    }
                                }
                            }
                        },
                        series: [{
                            type: 'pie',
                            name: '期限占比',
                            data: [
				               <%=GetReport3JSSeries() %>
			                ]
                        }]
                    });
                });

            </script>
        <%} %>
         <%if (ReportType == 4)
           { %>
           <asp:GridView ID="gv4" runat="server" CssClass="table" AutoGenerateColumns="true" Width="100%">
           </asp:GridView>
           <div id="ReportType4container" style="width:95%; margin-top:5px;" >
                  图
            </div>
           
             <script type="text/javascript">
                    var chart;
                    $(document).ready(function () {
                        chart = new Highcharts.Chart({
                            chart: {
                                renderTo: 'ReportType4container',
                                type: 'spline'
                            },
                            title: {
                                text: '同期放款台数对比分析',
                                style :{
                                    color: '#3E576F',
	                                fontSize: '15px'
                                }
                            },
                            xAxis: {
                                categories:  <%=GetReport4JSCategories() %>
                            },
                            yAxis: {
                                title: {
                                    text: '年份(台数)'
                                }
                            },
                            tooltip: {
                                crosshairs: true,
                                shared: true
                            },
                            legend: {
                                layout: 'vertical',
                                align: 'right',
                                verticalAlign: 'top',
                                x: -10,
                                y: 100,
                                borderWidth: 0
                            },
		                    plotOptions: {
			                    line: {
				                    dataLabels: {
					                    enabled: false,
                                        formatter: function() {
	                                        return this.y+'台';
                                        }
				                    }
			                    }
		                    },
                            series: <%=GetReport4JSSeries() %>
                        });
                    });


            </script>
          <%} %>

          <%if (ReportType == 5)
           { %>
           <div style="overflow:auto; height:180px;">
             
                 <asp:repeater id="gv5" runat="server">
                        <HeaderTemplate>
                            <table class="table" width="100%" >
                            <thead>
                                <tr  >  
                                    <th align="center">年份</th>
                                    <th >1月</th>                                    
                                    <th >2月</th>
                                    <th >3月</th>
                                    <th >4月</th>
                                    <th >5月</th>
                                    <th >6月</th>
                                    <th >7月</th>
                                    <th >8月</th>
                                    <th >9月</th>
                                    <th >10月</th>
                                    <th >11月</th>
                                    <th >12月</th>  
                                   <th >合计</th>           
                                </tr>
                            </thead>
                            <tbody>
                         </HeaderTemplate>
                         <ItemTemplate>
                                <tr >			
				                    <td><%# Eval("年份")%></td>
				                    <td><%# FormatDecimalToStrings(Eval("1月"),"N")%></td>
                                    <td><%# FormatDecimalToStrings(Eval("2月"),"N")%></td> 
                                    <td><%# FormatDecimalToStrings(Eval("3月"),"N")%></td>  
                                    <td><%# FormatDecimalToStrings(Eval("4月"), "N")%></td> 
                                    <td><%# FormatDecimalToStrings(Eval("5月"), "N")%></td>
                                    <td><%# FormatDecimalToStrings(Eval("6月"), "N")%></td> 
                                    <td><%# FormatDecimalToStrings(Eval("7月"), "N")%></td>  
                                    <td><%# FormatDecimalToStrings(Eval("8月"), "N")%></td> 
                                    <td><%# FormatDecimalToStrings(Eval("9月"), "N")%></td> 
                                    <td><%# FormatDecimalToStrings(Eval("10月"), "N")%></td>
                                    <td><%# FormatDecimalToStrings(Eval("11月"), "N")%></td> 
                                    <td><%# FormatDecimalToStrings(Eval("12月"), "N")%></td>
                                    <td><%# FormatDecimalToStrings(Eval("合计"), "N")%></td> 
			                    </tr>
                         </ItemTemplate>
                         <FooterTemplate>
                                </tbody>
                             </table>
                         </FooterTemplate>
                        </asp:repeater>
           </div>
           <div id="ReportType5container" style="width:95%; margin-top:5px;" >
                  图
            </div>
           
             <script type="text/javascript">
                    var chart;
                    $(document).ready(function () {
                        chart = new Highcharts.Chart({
                            chart: {
                                renderTo: 'ReportType5container',
                                type: 'spline'
                            },
                            title: {
                                text: '同期放款融资额对比分析',
                                style :{
                                    color: '#3E576F',
	                                fontSize: '15px'
                                }
                            },
                            xAxis: {
                                categories:  <%=GetReport5JSCategories() %>
                            },
                            yAxis: {
                                title: {
                                    text: '年份'
                                }
                            },
                            tooltip: {
                               crosshairs: true,
                                shared: true
                            },
                            legend: {
                                layout: 'vertical',
                                align: 'right',
                                verticalAlign: 'top',
                                x: -10,
                                y: 100,
                                borderWidth: 0
                            },
		                    plotOptions: {
			                    line: {
				                    dataLabels: {
					                    enabled: false,
                                        formatter: function() {
	                                        return this.y+'台';
                                        }
				                    }
			                    }
		                    },
                            series: <%=GetReport5JSSeries() %>
                        });
                    });


            </script>
          <%} %>
          <%if (ReportType == 6)
           { %>
         
           <asp:GridView ID="gv6" runat="server" CssClass="table" AutoGenerateColumns="true" Width="100%">
           
           </asp:GridView>
         
           <div id="ReportType6container" style="width:95%; margin-top:5px;" >
                  图
            </div>
           
             <script type="text/javascript">
                    var chart;
                    $(document).ready(function () {
                        chart = new Highcharts.Chart({
                            chart: {
                                renderTo: 'ReportType6container',
                                type: 'spline'
                            },
                            title: {
                                text: '同期报单台数对比分析',
                                style :{
                                    color: '#3E576F',
	                                fontSize: '15px'
                                }
                            },
                            xAxis: {
                                categories:  <%=GetReport6JSCategories() %>
                            },
                            yAxis: {
                                title: {
                                    text: '年份'
                                }
                            },
                            tooltip: {
                                
                                crosshairs: true,
                                shared: true
                            },
                            legend: {
                                layout: 'vertical',
                                align: 'right',
                                verticalAlign: 'top',
                                x: -10,
                                y: 100,
                                borderWidth: 0
                            },
		                    plotOptions: {
			                    line: {
				                    dataLabels: {
					                    enabled: false,
                                        formatter: function() {
	                                        return this.y+'台';
                                        }
				                    }
			                    }
		                    },
                            series: <%=GetReport6JSSeries() %>
                        });
                    });


            </script>
          <%} %>
    </div>
    </form>
</body>
</html>
